<template>
  <div class="order">
    <top/>
    <el-row :span="24" class="titleClass">
      <el-col :span="4">
        <el-button @click="showOrderDialog" type="primary">生成订单</el-button>
      </el-col>
    </el-row>
    <el-dialog title="生成订单" :visible.sync="addOrderDialog">
      <el-form label-width="80px" >
        <el-form-item label="订单来源" style="width: 220px;">
          <el-input v-model="addOrderForm.orderSource" disabled></el-input>
        </el-form-item>
        <el-form-item label="产品种类">
          <el-select placeholder="请选择" v-model="addOrderForm.productId">
            <el-option v-for="item in productList" :key="item.productId" :label="item.productName" :value="item.productId">

            </el-option>
          </el-select>
          <!-- <el-input placeholder="请输入产品" v-model="addOrderForm.productId"></el-input> -->
        </el-form-item>
         <el-form-item label="生产数量" style="width: 220px;">
          <el-input placeholder="请输入产品数量" v-model="addOrderForm.productMount"></el-input>
        </el-form-item>
         <el-form-item label="截止日期" style="width: 220px;">
           <el-date-picker type="date" placeholder="选择日期" v-model="addOrderForm.orderEndDate"></el-date-picker>
        </el-form-item>
         <el-form-item label="订单状态" style="width: 220px;">
          <el-input v-model="addOrderForm.orderState" disabled></el-input>
        </el-form-item>
        <el-form-item>
            <el-button @click="addOrderDialog=false">取消</el-button>
            <el-button type="primary" @click="onSubmit">立即下单</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
    
    <el-table :data="orderList" style="width: 100%">
      <el-table-column prop="orderId" label="订单编号" width="160"></el-table-column>
      <el-table-column prop="orderSource" label="订单来源" width="120"></el-table-column>
      <el-table-column prop="productId" label="产品类型" width="120"></el-table-column>
      <el-table-column prop="productMount" label="生产数量" width="120"></el-table-column>
      <el-table-column prop="orderEndDate" label="截止日期" width="160" value-format="yyyy-MM-dd"></el-table-column>
      <el-table-column prop="orderState" label="订单状态" width="120"></el-table-column>
      <el-table-column prop="finishMount" label="完成数量" width="120"></el-table-column>

      <el-table-column label="操作" width="350">
        <template slot-scope="scope">
          <el-button size="mini" type="primary" @click="editOrder(scope.$index, scope.row)">修改订单状态</el-button>
          <el-button size="mini" type="primary" @click="createPlan(scope.$index, scope.row)">生成生产计划</el-button>
          <el-button size="mini" type="danger" @click="deleteOrder(scope.$index, scope.row)">删除</el-button>
        </template> 
      </el-table-column>
    </el-table>

    <el-dialog title="生成生产计划" :visible.sync="createPlanDialog">
      <el-form label-width="80px">
        <el-form-item label="订单编号" style="width: 220px;">
          <el-input  v-model="createOrderPlanForm.orderId" disabled></el-input>
        </el-form-item>
        <el-form-item label="产品名称" style="width: 220px;">
          <el-input  v-model="createOrderPlanForm.producuName" disabled></el-input>
        </el-form-item>
        <el-form-item label="生产数量" style="width: 220px;">
          <el-input  v-model="createOrderPlanForm.planMount" disabled></el-input>
        </el-form-item>
        <el-form-item label="交货日期" style="width: 220px;">
           <el-date-picker type="date" v-model="createOrderPlanForm.deliveryDate" disabled></el-date-picker>
        </el-form-item>
        <el-form-item label="开始日期" style="width: 220px;">
           <el-date-picker type="date" v-model="createOrderPlanForm.planBeginDate"></el-date-picker>
        </el-form-item>
        <el-form-item label="结束日期" style="width: 220px;">
           <el-date-picker type="date" v-model="createOrderPlanForm.planEndDate"></el-date-picker>
        </el-form-item>
        <el-form-item label="计划状态" style="width: 220px;">
           <el-input  v-model="createOrderPlanForm.planState" disabled></el-input>
        </el-form-item>
        <el-form-item label="所属工厂" style="width: 220px;">
           <el-input  v-model="createOrderPlanForm.factoryId" disabled></el-input>
        </el-form-item>
         <el-form-item label="计划名称" style="width: 220px;">
           <el-input  v-model="createOrderPlanForm.planName" ></el-input>
        </el-form-item>
        <el-form-item>
            <el-button @click="createPlanDialog=false">取消</el-button>
            <el-button type="primary" @click="createOrderPlan">生成计划</el-button>
        </el-form-item>
      </el-form>
      
    </el-dialog>

    <el-dialog title="修改订单信息" :visible.sync="updateOrderDialog">
      <el-form label-width="80px">
        <el-form-item label="订单编号" style="width: 220px;">
          <el-input  v-model="updateOrderForm.orderId" disabled></el-input>
        </el-form-item>
        <el-form-item label="订单状态" style="width: 220px;">
          <el-select v-model="updateOrderForm.orderState" placeholder="请选择">
            <el-option v-for="item in orderStateList" :key="item.value" :label="item.label" :value="item.value"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="生产数量" style="width: 220px;">
          <el-input  v-model="updateOrderForm.productMount"></el-input>
        </el-form-item>
        <el-form-item label="截止日期" style="width: 220px;">
           <el-date-picker type="date" v-model="updateOrderForm.orderEndDate"></el-date-picker>
        </el-form-item>
        <el-form-item>
            <el-button @click="updateOrderDialog=false">取消</el-button>
            <el-button type="primary" @click="updateOrder">确认修改</el-button>
        </el-form-item>
      </el-form>
      
    </el-dialog>
  </div>
</template>

<script>
// @ is an alias to /src
import Top from '@/components/Top.vue'

export default {
  name: 'order',
  components: {
    Top
  },
  data(){
    return{
      addOrderDialog:false,
      updateOrderDialog:false,
      deleteOrderDialog:false,
      createPlanDialog:false,
      orderList:[],
      productList:[],

     orderForm:{orderState:''},
     addOrderForm:{orderSource:"线下订单",productId:'',orderState:'未接单',productMount:'',orderEndDate:'',factoryId:''},
     orderStateList:[{value:"未接单",label:"未接单"},{value:"已拒单",label:"已拒单"},{value:"已接单",label:"已接单"},{value:"生产中",label:"生产中"},{value:"已完成",label:"已完成"}],
     value:'',
     updateOrderForm:{orderEndDate:'',productMount:'',orderState:'',orderId:''},
     createOrderPlanForm:{orderId:'',producuName:'',planMount:'',deliveryDate:'',planBeginDate:'',planEndDate:'',factoryId:'',orderState:'',planState:'未执行',planName:''},
     factoryId:this.$route.query.factoryId,
     user:{}
   }
  },
  created(){
    this.user = this.$getSessionStorage('user');  
    // 显示全部订单
    this.$axios.post(
        'OrderController/findAllOrderByFactoryId',
        this.$qs.stringify({factoryId:this.factoryId})
      ).then((value) => {
        if(this.user != null){
          this.orderList=value.data;
        }

      }).catch((value) => {
        console.error(value);
      })
  },
  methods:{
    showAllOrder(){
      this.$axios.post(
        'OrderController/findAllOrderByFactoryId',
        this.$qs.stringify({factoryId:this.factoryId})
      ).then((value) => {
        this.orderList=value.data;
      }).catch((value) => {
        console.error(value);
      })
    },
    // 显示生成订单页面
    showOrderDialog(){
      this.addOrderDialog=true;
      this.addOrderForm.factoryId=this.factoryId
      this.$axios.post(
        'ProductController/findAllProductByFactoryId',
        this.$qs.stringify({
          factoryId:this.addOrderForm.factoryId
        })
      ).then((value) => {
        this.productList=value.data;
      }).catch((value) => {
        console.error(value);
      })
    },
    // 订单提交
    onSubmit(){  
      this.$axios.post(
        'OrderController/createOrder',
        this.$qs.stringify({
          productId:this.addOrderForm.productId,
          productMount:this.addOrderForm.productMount,
          orderState:this.addOrderForm.orderState,
          orderEndDate:this.addOrderForm.orderEndDate,
          factoryId:this.addOrderForm.factoryId
        })
      ).then((value) => {
        if(value.data==1){
          this.$message({type:"success",message:"添加成功"});
        }else{
          this.$message({type:"error",message:"添加失败"});
        }
        this.showAllOrder();
      }).catch((value) => {
        console.error(value);
      })
      this.addOrderDialog=false;
      
    },
    //修改订单
    editOrder(index,row){
      this.updateOrderDialog=true;
      this.updateOrderForm.orderState=row.orderState,
      this.updateOrderForm.productMount=row.productMount,
      this.updateOrderForm.orderEndDate=row.orderEndDate,
      this.updateOrderForm.orderId=row.orderId,

      this.orderForm.orderState=row.orderState;
    },
    //提交修改后的订单
    updateOrder(){
      console.log(this.updateOrderForm.orderState);
      if(this.updateOrderForm.orderState!="已完成"&&this.updateOrderForm.orderState!="生产中"){
        this.$axios.post(
          'OrderController/updateOrder',
          this.$qs.stringify({
            orderId:this.updateOrderForm.orderId,
            orderEndDate:this.updateOrderForm.orderEndDate,
            orderState:this.updateOrderForm.orderState,
            productMount:this.updateOrderForm.productMount
          })
        ).then((value) => {
          if(value.data==1){
            this.$message({type:'success',message:'修改成功'});
          }else{
            this.$message({type:'error',message:'修改失败'});
          }
          this.showAllOrder();
        }).catch((value) => {
          console.error(value);
        })
      }else{
        this.$message({type:'error',message:'该订单已经完成，或者该订单正在生产中，您无法更改'});
      }
      this.updateOrderDialog=false;
    },
    //删除订单
    deleteOrder(index,row){
      let state=row.orderState;
      console.log(state);
      this.$confirm("确定删除:"+row.orderId+"号订单吗").then(() => {
      if(state=="生产中"){
        this.$message({type:"error",message:"该订单正在生产中，无法删除"});
      }
      if(state=="已完成"){
        this.$message({type:"error",message:"订单完成，将用于统计业绩，无法删除"});
      }
      if(state=="已拒单"||state=="未接单"||state==null){
        this.$axios.post(
          'OrderController/deleteOrderByOrderId',
          this.$qs.stringify({orderId:row.orderId})
        ).then((value) => {
         if(value.data==1){
            this.$message({type:"success",message:"删除成功"});
            this.showAllOrder;
         }else{
            this.$message({type:"error",message:"删除失败"});
         }
         this.showAllOrder();
        }).catch((value) => {
          console.error(value);
        })
      }
      }) 
    },
    //生成生产计划对话框
    //createOrderPlanForm:{orderId:'',producuName:'',planMount:'',deliveryDate:'',planBeginDate:'',planEndDate:'',factoryId:''},
    createPlan(index,row){
      this.createPlanDialog=true;
      this.createOrderPlanForm.orderId=row.orderId;
      this.createOrderPlanForm.producuName=row.productId;
      this.createOrderPlanForm.planMount=row.productMount;
      this.createOrderPlanForm.deliveryDate=row.orderEndDate;
      this.createOrderPlanForm.factoryId=this.factoryId;
      this.createOrderPlanForm.orderState=row.orderState
    },
    //生成生产计划
    createOrderPlan(){
      if(this.createOrderPlanForm.orderState=="已接单"){
        if(this.createOrderPlanForm.planBeginDate>this.createOrderPlanForm.deliveryDate){
          this.$message({type:'error',message:"计划开始日期不能晚于交货日期!!!"});
          return;
        }else if(this.createOrderPlanForm.planBeginDate>this.createOrderPlanForm.planEndDate){
          this.$message({type:'error',message:"计划开始日期不能晚于计划结束日期!!!"});
          return;
        }else if(this.createOrderPlanForm.planEndDate>this.createOrderPlanForm.deliveryDate){
          this.$message({type:'error',message:"计划结束日期不能晚于交货日期!!!"});
          return;
        }else{
          this.$axios.post(
            //
            'PlanController/savePlan',
            this.$qs.stringify({
              orderId:this.createOrderPlanForm.orderId,
              productName:this.createOrderPlanForm.producuName,
              planMount:this.createOrderPlanForm.planMount,
              deliveryDate:this.createOrderPlanForm.deliveryDate,
              planBeginDate:this.createOrderPlanForm.planBeginDate,
              planEndDate:this.createOrderPlanForm.planEndDate,
              factoryId:this.createOrderPlanForm.factoryId,
              planName:this.createOrderPlanForm.planName
            })
          ).then((value) => {
            if(value.data==1){
              this.$message({type:'success',message:"计划已经生成!!!"});
            }else{
              this.$message({type:'error',message:"生成计划失败!!"});
            }
          }).catch((value) => {
            console.error(value);
          })
        }
      }else{
        this.$message({type:'error',message:"不是已接单订单，无法生成生产计划，请确认订单状态!!!"});
      }
      this.createPlanDialog=false;
    },
  }
}
</script>
